<template>
	<view class="my">
		<view class="my-info">
			<image :src="msterInfo.avatar"></image>
			<view class="my-info-name">{{msterInfo.nickname}}</view>
			<view>{{otherInfo.dec}}</view>
		</view>
	</view>
</template>

<script setup>
	import {onBeforeMount,ref, computed} from 'vue'
	
	const msterInfo = ref({})
	const otherInfo = computed(() => msterInfo.value.other?JSON.parse(msterInfo.value.other):{})
	
	onBeforeMount(()=>{
		msterInfo.value = JSON.parse(uni.getStorageSync('mster')) 
		
	})
</script>

<style lang="scss">
	$color-primary:#1da57a;
	.my{
		.my-info{
			background: linear-gradient(to right bottom,$color-primary,#fff);
			text-align: center;
			padding-bottom: 30rpx;
			image{
				width: 200rpx;
				height: 200rpx;
				margin-top: 140rpx;
				border-radius: 50%;
			}
			.my-info-name{
				font-size: 38rpx;
				font-weight: bold;
				line-height: 80rpx;
			}
		}
	}
</style>
